#mg-ep-page {
  width: 1000px;
  height: auto;
  margin: 10px auto;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding-left: 60px;

  .mg-info {
    display: flex;
    position: relative;
    margin-bottom: 20px;

    .mg-cover-box {
      width: 200px;
      height: 300px;
      flex-shrink: 0;
      border: 1px solid #f4f4f4;

      .btn-box {
        width: 100%;
        height: 50px;
        display: flex;
        justify-content: center;
        align-items: center;
      }
    }

    .mg-cover-box img {
      width: 200px;
      height: 250px;
      object-fit: fill;
    }

    .mg-info-box {
      position: relative;
      padding-left: 25px;

      .cnTeam {
        width: 300px;
        overflow: hidden;
        overflow-wrap: break-word;
      }

      .about-box {
        padding-top: 20px;
        width: 725px;

        .about-off {
          overflow: hidden;
          overflow-wrap: break-word;
          text-overflow: ellipsis;
          display: -webkit-box;
          -webkit-line-clamp: 5;
          -webkit-box-orient: vertical;
        }

        .about-on {
          overflow: hidden;
          overflow-wrap: break-word;
        }

      }

    }

    #skeleton-box {
      display: flex;

      .skeleton-img {
        width: 200px;
        height: 250px;
      }

      .skeleton-info {
        width: 100%;
        height: 300px;
        display: flex;
        flex-direction: column;
        align-content: flex-start;
        padding-left: 25px;
        padding-top: 10px;
      }
    }
  }

  .mg-ep-list {
    width: 100%;
    display: flex;
    flex-direction: column;
    min-height: 300px;

    .ep-tab-box {
      width: 100%;
      height: 35px;
      display: flex;
      justify-content: space-between;
      align-items: center;

      .dropdown-tabs {
        border: none;
        width: 110px;

        .el-input__inner {
          border: none;
          background: none;
        }

        .dropdown-menu {
          height: 200px !important;
          overflow-y: auto !important;
        }
      }

      .dropdown-tabs:hover {
        color: #2f78b1;
        cursor: pointer;
      }
    }

    .ep-item-box {
      display: flex;
      flex-wrap: wrap;
      justify-content: flex-start;

      .ep-item {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        width: 70px;
        height: 35px;
        margin: 10px 0 0 10px;
        border: 1px solid #dadada;
        border-radius: 5px;
        flex-shrink: 0;
        font-size: small;

        &:hover {
          color: #409EFF;
          cursor: pointer;
        }
      }
    }

  }

  .mark {
    width: 200px;
    height: 200px;
    position: absolute;
    top: -20px;
    right: 30px;
    font-size: 200px;
    color: var(--theme-color);
    transform: rotate(25deg);
    opacity: 0.2;
  }
}